<script lang="ts" setup name="knowledgeStandard">
import { getListByConditionsWithPage, urls } from '@/index';
import type { DialogModel, KnowledgeStandard, KnowledgeStandardQueryCondition } from '@/index.d';
import { useRequest } from 'vue-request';
import DetailDialog from './DetailDialog.vue';
const title = '标准规范';
const queryCondition = reactive<KnowledgeStandardQueryCondition>({
  deleted: false,
  change: false,
  currentPage: 1,
  pageSize: 20
});

const resetQueryCondition = () => {
  queryCondition.currentPage = 1;
  queryCondition.pageSize = 20;
  queryCondition.deleted = false;
  delete queryCondition.category;
  delete queryCondition.name;
  delete queryCondition.reference;
  delete queryCondition.standardVersion;
};

const {
  data: getMainTableListData,
  run: getMainTableListRun,
  loading: getMainTableListLoading
} = useRequest(() => getListByConditionsWithPage(urls.knowledgeStandard, queryCondition));

const handleResetQuery = () => {
  resetQueryCondition();
  getMainTableListRun();
};

const detailDialogModel = reactive<DialogModel<KnowledgeStandard>>({
  visible: false,
  title,
  type: 'view',
  id: 0,
  change: false
});

watch(
  () => detailDialogModel.visible,
  (value: boolean) => {
    if (!value && detailDialogModel.change) {
      getMainTableListRun();
      detailDialogModel.change = false;
    }
  }
);
</script>
<template>
  <HqContainerTable
    :base-url="urls.ndeReportReviewRecord"
    :title="title"
    :loading="getMainTableListLoading"
    :total="getMainTableListData?.total"
    :table-data="getMainTableListData?.records"
    v-model:pageSize="queryCondition.pageSize"
    v-model:current-page="queryCondition.currentPage"
    @handle-query="getMainTableListRun"
    @handle-reset-query="handleResetQuery"
    @handle-reload="getMainTableListRun"
    v-model:detail-dialog-model="detailDialogModel"
    :operate-column="true"
  >
    <template #search>
      <hq-col kind="search">
        <el-select
          v-model="queryCondition.category"
          clearable
          placeholder="请选择种类"
          @change="getMainTableListRun"
        >
          <HqDictionary type-text="标准种类" />
        </el-select>
      </hq-col>
      <hq-col kind="search">
        <el-input v-model="queryCondition.name" placeholder="请输入标准名称" clearable />
      </hq-col>
      <hq-col kind="search">
        <el-input v-model="queryCondition.reference" placeholder="请输入标准编号" clearable />
      </hq-col>
      <hq-col kind="search">
        <el-input v-model="queryCondition.standardVersion" placeholder="请输入标准版本" clearable />
      </hq-col>
    </template>

    <template #tableColumns>
      <HqTableColumn label="标准种类" prop="category" :min-width="40" />
      <HqTableColumn label="标准编号" :min-width="40">
        <template #default="{ row }">
          <el-link
            type="success"
            v-if="row.attachmentUrl"
            :href="row.attachmentUrl"
            target="_blank"
          >
            {{ row.reference }}
          </el-link>
          <el-text v-else> {{ row.reference }} </el-text>
        </template>
      </HqTableColumn>
      <HqTableColumn label="标准名称" :min-width="300">
        <template #default="{ row }">
          <el-link
            type="success"
            v-if="row.attachmentUrl"
            :href="row.attachmentUrl"
            target="_blank"
          >
            {{ row.name }}
          </el-link>
          <el-text v-else> {{ row.name }} </el-text>
        </template>
      </HqTableColumn>
      <HqTableColumn label="标准版本" prop="standardVersion" :min-width="30" />
      <HqTableColumn label="发布日期" prop="publishDate" :min-width="30" />
    </template>
  </HqContainerTable>
  <DetailDialog v-model:dialog-model="detailDialogModel" v-if="detailDialogModel.visible" />
</template>
<style lang="scss" scoped></style>
